<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>用户管理</title>
<link rel="stylesheet" href="resources/css/style.css">
<link rel="stylesheet" href="resources/js/jquery-ui/jquery-ui.min.css">
</head>
<body>
  <!-- 用户列表 -->
  <div class="tbl-title">用户列表</div>
  <button onclick="showAddUserModal()">添加新的用户</button>
  <table id="users" class="tbl-list">
    <thead>
      <tr>
        <th>账户</th>
        <th>密码</th>
        <th>用户名</th>
        <th>性别</th>
        <th>信息</th>
        <th>操作</th>
      </tr>
    </thead>
    <tbody>
    </tbody>
  </table>
  
  <!-- 添加用户模态框 -->
  <div id="add-user-modal" title="添加用户" style="display:none;">
    <form id="add-user-form">
      <table class="modal-tbl">
        <tr><td>账户</td><td><input type="text" name="username"></td></tr>
        <tr><td>密码</td><td><input type="password" name="password"></td></tr>
        <tr><td>姓名</td><td><input type="text" name="name"></td></tr>
        <tr>
        	<td>性别</td>
        	<td>
        		<input type="radio" name="gender" value="1" checked="checked">男 
        		<input type="radio" name="gender" value="2">女 
        	</td>
        </tr>
        <tr><td>信息</td><td><input type="text" name="info"></td></tr>
      </table>
    </form>
  </div>
  
  <!--删除用户对话模态框 -->
  <div id="delete-user-modal" title="删除用户" style="display:none;">
    <p>确定删除该用户吗？</p>
  </div>
  
  <!-- 更新用户模态框 -->
  <div id="update-user-modal" title="更新用户" style="display:none;">
    <form id="update-user-form">
      <table class="modal-tbl">
        <tr style="display: none"><td>ID</td><td><input type="text" name="id"></td></tr>
        <tr><td>账户</td><td><input type="text" name="username"></td></tr>
        <tr><td>密码</td><td><input type="password" name="password"></td></tr>
        <tr><td>姓名</td><td><input type="text" name="name"></td></tr>
        <tr>
        	<td>性别</td>
        	<td>
        		<input type="radio" name="gender" value="1" checked="checked">男 
        		<input type="radio" name="gender" value="2">女 
        	</td>
        </tr>
        <tr><td>信息</td><td><input type="text" name="info"></td></tr>
      </table>
    </form>
  </div>
  
  <!-- 提示信息模态框 -->
  <div id="msg-modal" title="" style="display:none">
    <p></p>
  </div>
  
  <script src="resources/js/jquery-3.3.1.min.js"></script>
  <script src="resources/js/jquery.serializejson.min.js"></script>
  <script src="resources/js/jquery-ui/jquery-ui.min.js"></script>
  <script src="resources/js/html/adminuser.js"></script>

</body>
</html>